<template>
  <baidu-map class="map" center="长沙" :scroll-wheel-zoom="true">
    <bm-context-menu>
      <bm-context-menu-item
        :callback="gotoBeijing"
        text="去北京"
      ></bm-context-menu-item>
      <bm-context-menu-item
        :callback="gotoShanghai"
        text="去上海"
      ></bm-context-menu-item>
    </bm-context-menu>
  </baidu-map>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
    gotoBeijing(e) {
      this.center = {
        lng: 116.404,
        lat: 39.915,
      };
    },
    gotoShanghai(e) {
      this.center = {
        lng: 121.473354,
        lat: 31.238413,
      };
    },
  },
};
</script>
<style scoped>
.map {
  width: 100%;
  height: 100%;
}
</style>